<template>
  <div class="app-container">

    <div class="filter-container">
      <el-checkbox-group v-model="formThead">
        <el-checkbox :label="item" :value="item" :key="item.value"  v-for="item in headerData">{{item.label}}</el-checkbox>
      </el-checkbox-group>
    </div>

    <el-table class="table-border color-none" :data="tableData"  fit highlight-current-row style="width: 100%">
      <el-table-column :key='item.value' align="center" v-for='(item,index) in formThead' :label="item.label">
        <template slot-scope="scope">
          {{scope.row[item.value]}}
        </template>
      </el-table-column>
    </el-table>

  </div>
</template>

<script>
  export default {
    data() {
      const headerData = [{
        value: 'compressibilityRatio',
        label: '压缩系数比'
      }, {
        value: 'correctionCoefficient',
        label: '修正系数比'
      }, {
        value: 'meterKCoefficient',
        label: '仪表K系数'
      }, {
        value: 'errorTemperature',
        label: '温度测量错误时代替值'
      }, {
        value: 'errorAirPressure',
        label: '气压测量错误时代替值'
      }, {
        value: 'normCumulant',
        label: '标况累积量'
      }, {
        value: 'workCumulant',
        label: '工况累积量'
      }, {
        value: 'errorNorm_cumulant',
        label: '错误标况累积量'
      }, {
        value: 'errorWorkCumulant',
        label: '错误工况累积量'
      }, {
        value: 'workPressure',
        label: '工况压力'
      }, {
        value: 'workTemperature',
        label: '工况温度'
      }, {
        value: 'workMomentFlow',
        label: '工况瞬时流量'
      }, {
        value: 'normMomentFlow',
        label: '标况瞬时流量'
      }, {
        value: 'batteryLevel',
        label: '电池电量' }]
      return {
        headerData,
        tableData: [
          {
            compressibilityRatio: 12.0,
            correctionCoefficient: 1.0,
            meterKCoefficient: 2.0,
            errorTemperature: 12.1,
            normCumulant: 22,
            workCumulant: 23,
            errorNorm_cumulant: 123,
            errorWorkCumulant: 233,
            workPressure: 232,
            workTemperature: 2321.2,
            workMomentFlow: 212.11112,
            normMomentFlow: 213232.11,
            batteryLevel: 0.3
          },
          {
            compressibilityRatio: 12.0,
            correctionCoefficient: 1.0,
            meterKCoefficient: 2.0,
            errorTemperature: 12.1,
            normCumulant: 22,
            workCumulant: 23,
            errorNorm_cumulant: 123,
            errorWorkCumulant: 233,
            workPressure: 232,
            workTemperature: 2321.2,
            workMomentFlow: 212.11112,
            normMomentFlow: 213232.11,
            batteryLevel: 0.3
          }
        ],
        formThead: [headerData[0]]
      }
    }
  }
</script>
<style scoped>
  .el-checkbox:first-child{
    margin-left: 30px;
  }
</style>
